<template>
  <div class="app-container">
    <div class="tip">
      <p>系统默认分组不能删除！</p>
      <p>删除分组将会自动删除此分组下的子分类！</p>
    </div>
    <el-button type="primary" size="small" @click="addClassifyDialog = true"
      >添加分类组</el-button
    >
    <el-table :data="list" style="width: 100%; margin-top: 20px" border>
      <el-table-column prop="name" label="分类组名称" width="width">
      </el-table-column>
      <el-table-column prop="alias" label="调用名" width="width">
      </el-table-column>
      <el-table-column prop="prop" label="类型" width="width">
        <template>
          <el-button type="info" plain disabled>系统分组</el-button>
        </template>
      </el-table-column>
      <el-table-column prop="prop" label="操作" width="width">
        <template slot-scope="scope">
          <el-button size="small" @click="$router.push(`/detail/${scope.row.id}`)">管理分类</el-button>
          <el-button type="primary" size="small" disabled>编辑</el-button>
          <el-button type="danger" size="small" disabled>删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <addClassify :addClassifyDialog.sync="addClassifyDialog"/>
  </div>
</template>

<script>
import addClassify from '@/views/platformSystem/classifyConfig/otherClassify/components/addClassify'
export default {
  components: {
    addClassify,
  },
  data() {
    return {
      addClassifyDialog: false,
      list: [
        { id: 1, alias: "QS_trade", name: "行业分类", is_sys: 1 },
        {
          id: 2,
          alias: "QS_company_type",
          name: "企业性质分类",
          is_sys: 1,
        },
        { id: 3, alias: "QS_scale", name: "企业规模", is_sys: 1 },
        { id: 4, alias: "QS_jobtag", name: "职位标签", is_sys: 1 },
        { id: 5, alias: "QS_resumetag", name: "简历标签", is_sys: 1 },
        { id: 6, alias: "QS_language", name: "语言分类", is_sys: 1 },
        {
          id: 7,
          alias: "QS_language_level",
          name: "语言熟练程度",
          is_sys: 1,
        },
        { id: 8, alias: "QS_current", name: "目前状态分类", is_sys: 1 },
      ],
    };
  },
};
</script>

<style lang="scss" scoped>
.category-table {
  font-family: Arial, sans-serif;
}
.tip {
  padding: 8px 16px;
  background-color: #fdf6ec;
  border-radius: 4px;
  border-left: 5px solid #f9c77c;
  margin: 0 0 20px;
  p {
    font-size: 14px;
    color: #e6a23c;
    line-height: 1em;
  }
}
</style>
